let left = document.querySelector('.left');
let right = document.querySelector('.right');
let box = document.getElementsByClassName('box')[0];
let item = document.getElementsByClassName('item');
let index = 1;
let sum = -400;
box.appendChild(box.firstElementChild.cloneNode(true));
box.insertBefore(box.children[item.length-2].cloneNode(true),box.firstElementChild)
box.style.transform = 'translateX(-400px)';
right.addEventListener('click',function(){
    if(index < item.length-2){
        index++;
        box.style.transform = `translateX(${index*sum}px)`;
        box.style.transition = `0.5s`
    }else if(index == item.length-2 ){
        box.style.transition = `0.5s`;
        index++;
        box.style.transform = `translateX(${index*sum}px)`;
        setTimeout(function(){
            index = 1;
            sum = -400;
            box.style.transition = 'none';
            box.style.transform = `translateX(${index*sum}px)`;
        },500)
    }
})
left.addEventListener('click',function(){
    index--;
    if(index == 0){
        box.style.transition = `0.5s`;
        box.style.transform = `translateX(${index*sum}px)`;
        setTimeout(function(){
            index = 4;
            box.style.transition = 'none';
            box.style.transform = `translateX(${index*(-400)}px)`;
        },500)
    }else if(index <= item.length-2){
        box.style.transition = `0.5s`;
        box.style.transform = `translateX(${index*sum}px)`;
    }
})
function add(){
    let xhr = new XMLHttpRequest();
    let data = {"type":'图片'}
    let url = "http://studentback.dfbuff.xyz/postMethod";
    xhr.open('POST',url);
    xhr.setRequestHeader('Content-Type','application/json');
    xhr.send(JSON.stringify(data))
    xhr.addEventListener('readystatechange',function(){
        if(xhr.readyState ==4){
            if(xhr.status ==200){
                let JsonData = JSON.parse(xhr.responseText);
                JsonData.result.forEach(function(value,index){
                    let img = document.createElement('img');
                    img.setAttribute('src',value.content);
                    item[index].appendChild(img);
                })
                item[4].innerHTML ='<img src='+JsonData.result[0].content+'>'
                item[5].innerHTML ='<img src='+JsonData.result[1].content+'>'
            }
        }
    })
}
add()